<template>
<div class="header">
    <div class="loginHeader">
        <mt-header title="登录">
            <router-link to="/" slot="left">
                <mt-button icon="back">返回</mt-button>
            </router-link>
            <mt-button slot="right" @click.prevent="changeLoginWay">{{changeMsg}}</mt-button>
        </mt-header>
    </div>
</div>
</template>
<script>
    export default{
        data(){
            return{
                loginWay:true,
                titleMsg:"登录",
                changeMsg:"密码登录"
            }
        },
        methods:{
            changeLoginWay(){
                this.loginWay=!this.loginWay;
                if(this.loginWay){
                    this.titleMsg="登录";
                    this.changeMsg="密码登录";
                }else{
                    this.titleMsg="密码登录";
                    this.changeMsg="短信登录";
                }
                this.$emit('getLoginWay',this.loginWay);
            },
        }
    }
</script>
<style  lang="scss" scoped>
    @import 'mint-ui/lib/style.css';
    @import '../style/mixin';
    .header{
        @include width-height(100%,2rem);
        position: relative;
        .loginHeader{
            @include width-height(100%,3rem);
    }
    }
</style>